<template>
  <videoPlayer class="vjs-custom-skin videoPlayer" ref="videoplayer"
               :playsinline="true" width="90%" :options="playerOptions"
               customEventName="changed" @play="onPlayerPlay($event)">
  </videoPlayer>
</template>
<script>
import 'video.js/dist/video-js.css'
import { videoPlayer } from 'vue-video-player'
import 'videojs-flash'
export default {
  components: {
    videoPlayer
  },
  data(){
    return{
      playerOptions: {
        width: "210",
        height: "134",
        language: 'zh-CN',
        techOrder: ['flash'],
        muted: true,
        autoplay: true,
        controls: true,
        loop: true,
        sources: [{
          type: 'rtmp',
          src: 'rtmp://192.168.99.111:11935/hls/34020000001180000001_34020000001180000002'
        }],
        poster: 'static/fire/bgpp.png',
        flash:{
          swf:'static/video-js.swf' //视频屏幕小于400x300时设置
        }
      },
    }
  }
}
</script>
